<template>
  <div class="wrap">
    <div class="nav">
      <ul>
        <li @tap = "navigateBack">返回</li>
        <li>详情页</li>
        <li></li>
      </ul>
    </div>
    <p class="xc">新城十里金樾：15#高层14#洋房在售</p>
    <p class="sq">2021-04-29 宿迁房产网 来源:宿迁房产网原创</p>
    <p class="xq">
      2021年4月29日，宿迁房产网讯:新城十里金越位于开发区，目前在售15#高层，仅剩一楼二楼房源，建面约110-127平方米,备案均价8379元/平；今日加推14#洋房，建面约127平方米，洋房44套，以上信息仅供参考，详情请致电售楼处
    </p>
    <img src="../../static/xq.png" alt="" class="oneimg" />
    <p class="fk">宿迁市富康大道与金坛路交汇处 <span>8379元/平方米</span></p>
    <img src="../../static/fd.png" alt="" class="twoimg" />
    <p class="more">更多好文</p>
    <div class="zn">
      <dl>
        <dd>
          <h2>中南紫云集:1#3#高层在售</h2>
          <p>中南.紫云集&emsp;15小时前</p>
        </dd>
        <dt>
          <img src="../../static/zn.png" alt="" />
        </dt>
      </dl>
    </div>
    <div class="ld">
      <dl>
        <dd>
          <h2>绿地城际空间站:22号商铺已推出</h2>
        </dd>
        <dt>
          <img src="../../static/ld.png" alt="" />
        </dt>
      </dl>
    </div>
  </div>
</template>
<script>
export default {
  data(){
    return{

    }
  },
  methods:{
   navigateBack(){
     uni.navigateBack()
   }
  }
};
</script>

<style lang="scss" scoped>
.wrap {
  width: 100%;
  height: 100%;
  .nav{
    width: 100%;
    height: 200rpx;
    background: rgb(35,144,249);
    color: #fff;
    ul li{
      line-height: 200rpx;
      margin-left: 90rpx;
    }
  }
  ul li {
    float: left;
    margin-left: 20rpx;
  }
  .xc {
    font-weight: bold;
    font-size: 52rpx;
    margin-top: 2+00rpx;
  }
  .sq {
    font-size: 30rpx;
    color: rgb(118, 110, 110);
    margin-top: 50rpx;
  }
  .xq {
    margin-top: 30rpx;
    font-size: 34rpx;
  }
  .fk {
    margin-top: 30rpx;
    font-size: 34rpx;
    span {
      margin-left: 64rpx;
      color: maroon;
    }
  }
  .oneimg {
    width: 714rpx;
    height: 400rpx;
    margin-left: 20rpx;
    margin-top: 30rpx;
  }
  .twoimg {
    width: 714rpx;
    height: 280rpx;
    margin-left: 20rpx;
    margin-top: 30rpx;
  }
  .more {
    font-weight: bold;
    font-size: 40rpx;
    margin-left: 20rpx;
    margin-top: 30rpx;
  }
  .zn {
    width: 100%;
    font-size: 34rpx;
    margin-top: 20rpx;
    dl {
      width: 100%;
      dd {
        float: left;
        margin-left: 20rpx;
      }
      dt {
        float: left; 
        margin-left: 200rpx;
        img {
          width: 140rpx;
          height: 128rpx;
        }
      }
    }  
  }
  .ld {   
    width: 100%;
    font-size: 34rpx;
    margin-top: 100rpx;
    dl {
      width: 100%;
      dd {
        float: left;
        margin-left: 20rpx;
      }
      dt {
        float: left;
        margin-left: 110rpx;
        img {
          width: 140rpx;
          height: 128rpx;
        }
      }
    }
  }
}
</style>